<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            overflow: hidden;
        }
        .north{
            position: absolute;
            height: 200px;
            width: 1000px;
            background: aquamarine;
        }
        .center{
            position: absolute;
            top: 210px;
            width: 1000px;
            bottom: 0;
            background: bisque;
            overflow: auto;
        }
        .center-child{
            float: left;
            width: 200px;
            height: 200px;
            background: black;
            margin: 10px;
        }
         .nav-item {
            float: left;
            padding: 0 5px;
            position: relative;
            cursor: pointer;
            text-transform: uppercase;
        }
        li {
            list-style: none;
        }
        .mf-shang-hei-regular {
            font-size: 18px;
            font-family: MFShangHei-Regular!important;
        }


        li,ul{padding:0}button,input,select,textarea{outline:0}.icon-quote,.iconfont{font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fade-in,.fade-out,.lazyImg{animation-duration:.5s;animation-iteration-count:1;animation-delay:0s}.sprity-16pt{background-image:url(../img/sprites/16pt.png)}.sprity-24pt{background-image:url(../img/sprites/24pt.png);display:inline-block;height:24px;background-repeat:no-repeat;width:24px;background-size:140px auto}.sprity-32pt{background-image:url(../img/sprites/32pt.png)}body{-webkit-font-smoothing:antialiased;font-family:"-apple-system",BlinkMacSystemFont,Roboto,"Helvetica Neue","MIcrosoft YaHei",sans-serif!important;background-color:#F8F8F8;}.com-footer{margin-top:40px}dd,dl,li,ul{margin:0}blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0}h6{font-size:1em}.clearfix:after{content:" ";visibility:hidden;display:block;height:0;clear:both}a{text-decoration:none}p{margin-top:0;margin-bottom:0}li{list-style:none}@font-face{font-family:quote;src:url(../font/quote.eot?t=1500964529975);src:url(../font/quote.eot?t=1500964529975#iefix) format('embedded-opentype'),url(../font/quote.woff?t=1500964529975) format('woff'),url(../font/quote.ttf?t=1500964529975) format('truetype'),url(../font/quote.svg?t=1500964529975#quote) format('svg')}.icon-quote{font-family:quote!important;font-size:16px}.icon-quote:before{content:"\e629"}@font-face{font-family:iconfont;src:url(../font/iconfont.eot?t=1500964529975);src:url(../font/iconfont.eot?t=1500964529975#iefix) format('embedded-opentype'),url(../font/iconfont.woff?t=1500964529975) format('woff'),url(../font/iconfont.ttf?t=1500964529975) format('truetype'),url(../font/iconfont.svg?t=1500964529975#iconfont) format('svg')}.iconfont{font-family:iconfont!important;font-size:12px}.icon-zoom_icon:before{content:"\e604"}.icon-star_icon:before{content:"\e606"}.icon-btn_left:before{content:"\e608"}.icon-btn_right:before{content:"\e609"}.icon-header_location:before{content:"\e60a"}.icon-close_icon:before{content:"\e60b"}.icon-tui:before{content:"\e60c"}.icon-tui1:before{content:"\e60d"}.icon-tui2:before{content:"\e60e"}.icon-downarrow:before{content:"\e60f"}.icon-search:before{content:"\e611"}.icon-checked:before{content:"\e614"}.icon-checkbox:before{content:"\e615"}.icon-up:before{content:"\e616"}.icon-hotel:before{content:"\e617"}.icon-bar:before{content:"\e618"}.icon-ktv:before{content:"\e619"}.icon-beauty:before{content:"\e61a"}.icon-food:before{content:"\e61b"}.icon-child:before{content:"\e61c"}.icon-married:before{content:"\e61d"}.icon-medical:before{content:"\e61e"}.icon-pet:before{content:"\e61f"}.icon-pedicure:before{content:"\e620"}.icon-travel:before{content:"\e621"}.icon-lable_level_1:before{content:"\e623";color:#FFB84E}.icon-lable_level_2:before{content:"\e622";color:#FFB84E}.icon-lable_level_3:before{content:"\e627";color:#FFB84E}.icon-lable_level_4:before{content:"\e624";color:#FFB84E}.icon-lable_level_5:before{content:"\e625";color:#FFB84E}.icon-lable_level_6:before{content:"\e626";color:#FFB84E}.icon-lable_level_7:before{content:"\e629";color:#FFB84E}.icon-lable_level_8:before{content:"\e628";color:#FFB84E}.icon-message_iconx:before{content:"\e62a"}.icon-collection_iconx:before{content:"\e62b"}.icon-order_iconx:before{content:"\e62c"}.icon-more_iconx:before{content:"\e62d"}.icon-comment_iconx:before{content:"\e62e"}.icon-money_iconx:before{content:"\e62f"}.icon-ticket_iconx:before{content:"\e630"}.icon-setting_iconx:before{content:"\e631"}.icon-safe{background-position:80%;float:left;position:relative;top:-7px}@font-face{font-family:numbers;src:url(../font/numbers.eot);src:url(../font/numbers.eot?#iefix) format("embedded-opentype"),url(../font/numbers.woff) format("woff"),url(../font/numbers.ttf) format("truetype"),url(../font/.svg#numbers) format("svg");font-style:normal;font-weight:400}.numfont{font-family:numbers!important;letter-spacing:-.5px}@font-face{font-family:MFShangHei-Regular;src:url(../font/MFShangHei-Regular.eot);src:url(../font/MFShangHei-Regular.eot?#iefix) format("embedded-opentype"),url(../font/MFShangHei-Regular.woff) format("woff"),url(../font/MFShangHei-Regular.ttf) format("truetype"),url(../font/MFShangHei-Regular.svg#MFShangHei-Regular) format("svg");font-style:normal;font-weight:400}.mf-shang-hei-regular{font-family:MFShangHei-Regular!important;}@keyframes fadeInAni{0%{opacity:0}100%{opacity:1}}@keyframes fadeOutAni{0%{opacity:1}100%{opacity:0}}.fade-in{animation-name:fadeInAni}.fade-out{animation-name:fadeOutAni}.lazyImg{animation-name:fadeInAni}@font-face{font-family:home-category-iconfont;src:url(../font/home-category-iconfont.eot?t=1503027869484);src:url(../font/home-category-iconfont.eot?t=1503027869484#iefix) format('embedded-opentype'),url(../font/home-category-iconfont.woff?t=1503027869484) format('woff'),url(../font/home-category-iconfont.ttf?t=1503027869484) format('truetype'),url(../font/home-category-iconfont.svg?t=1503027869484#home-category-iconfont) format('svg')}.home-category-iconfont{font-family:home-category-iconfont!important;font-size:14px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.col-iconfont,.icon-userinfo{font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.hc-icon-bar:before{content:"\e621"}.hc-icon-food:before{content:"\e622"}.hc-icon-child:before{content:"\e623"}.hc-icon-education:before{content:"\e624"}.hc-icon-decorate:before{content:"\e625"}.hc-icon-beauty:before{content:"\e626"}.hc-icon-ktv:before{content:"\e627"}.hc-icon-medical:before{content:"\e628"}.hc-icon-married:before{content:"\e629"}.hc-icon-hotel:before{content:"\e62a"}.hc-icon-sport:before{content:"\e62b"}.hc-icon-maoyan:before{content:"\e62c"}.hc-icon-travel:before{content:"\e62d"}.hc-icon-default:before{content:"\e62f"}.hc-icon-waimai:before{content:"\e630"}.hc-icon-zhenguo:before{content:"\e631"}.hc-icon-plane:before{content:"\e632"}.hc-icon-life:before{content:"\e633"}@font-face{font-family:icon-userinfo;src:url(icon-userinfo.eot?t=1506396008916);src:url(icon-userinfo.eot?t=1506396008916#iefix) format('embedded-opentype'),url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAeAAAsAAAAACzgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAAQwAAAFZW8kiEY21hcAAAAYAAAAB6AAABvstmBuhnbHlmAAAB/AAAA1QAAASocGM/PmhlYWQAAAVQAAAAMQAAADYP9hTJaGhlYQAABYQAAAAeAAAAJAjWBH5obXR4AAAFpAAAABwAAAAcHtf//2xvY2EAAAXAAAAAEAAAABADmgSebWF4cAAABdAAAAAfAAAAIAEWAF1uYW1lAAAF8AAAAUUAAAJtPlT+fXBvc3QAAAc4AAAARgAAAF38HUZoeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2BkyWCcwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGBwYKp5pMTf8b2CIYW5gaAEKM4LkAPgzDAsAeJzFkcsRwjAMRJ8S4wNDHQEyHFMMR07U4IrVRlhJuVBBNPOs2bX8GQm4ALN4iQb2xYj4yLX0Z67pNzbprmxMDF/3XXr4klkl2uuZJ51pulnKOqeFnff0f9xyfR8qOjIO9EVfCnUNvxcxEX8UMRV/FjEtXwv6D3ujFRcAAHicdVTfayNVFL7nTu8k6TaTZn5k7sw0SSfTZFqbCZrMTFq6aWvTVBIUhMLu9mXZXfFBUGFf7CJLmhdFFh+UFR8EtyCC4J8giw/6LwhCXxZRn/wDFNxOPDdJ3eKPYTjfN4d77v2+c+8dwggZ/yQ9ljjRyCp5geyTVwkBeR0qCi2C64cNug6GywxTVyTf892UV2lIHTArsl5oxmHNlFNyDhQoQcttxn6D+hCF23QLmoUigOXYh2p1SZU+gnnul95LBvQLMMreUm47SPr1Hb25rKWPF1TVUtUP0zJjaUrncgq8ZRYyLDMvJ1+ynG08Lq/RMixYvv3yUXbZUW9/EL5drJoZgNEINGdZ+Wonb+fxvW8XNNVKLWbT3M56Kzoc/3KFawvF2s8En7nxeHx/biSNiE08UicRIdVKisk1v9aBEGOU34a2WwIzr0AKtjEnXLJ/EfrGZpj8pq9mmKG+Q290pYPuDYp4/kolCPaDAPZmWJmiY55kcvr8wpa6xMrHdK17ROlR9/xHRHgdxIj9AP6BQi/uzWii1yJV3JsO7oyB6lxUGbVmMt0G+EJ2FXXrsvgMY0kBvSCGoSm4zAkMNuCzjQF0p4KffjNFUGHPrdfd5FuMQ91xdDoS8XwSYVdEabeDhThBRzh9d1pI30fchWCvTml9L0heBGfVgUkYk2ecEDrx8gd6KZHn0Icuey6qF27EQblkRPQfkCNFpsDc766VvHntniTduwafWC6903/6Wv8ORZQ+H9ymyUtRj9JeFB4AHNBT7rIH168/YC6P+7covdWnX08xaUGvFfYAemGrN+ut0OOR57GzA0Ly0Wx1A/soL5ol+FtXFMbteNFvQBUTuAXNuB01QKrI//NxoY1rp6cav1DM9UePdA6fFkoApQBvR9H8T0qPb04l3zRKbC35YY2VjMsZqGPmY+DqhsonIfmeq5uCY0h+fZYnF30n6PMK2SGE1Ygfk3aBmDIBT5xlszVT3Ra3eR2ilsActOMG4MX20LQCZfBrOHYLKDlLnjAG7tkZuIwlT5I/hxrn2hD4CocTse7JULXsfPuqnLad9OHGYdqx0/LVdt621OHoUuUZzgTfWVgWirIQeJVv2isWwF3FVlLZhw+zKSR38SdStf4C/ErOu3icY2BkYGAA4pdOBwzj+W2+MnCzMIDA1fcvMmD0////a1h+MDcAuRwMTCBRAIceDvcAAAB4nGNgZGBgbvjfwBDD8v0/ELD8YACKoAB2AMs6CFsAAAQAAAAD6QAABID//wSAAAAE9wAABPcAAAQAAAAAAAAAAHYAzgE0AXwB8AJUeJxjYGRgYGBnCGRgZQABJiDmAkIGhv9gPgMAEWMBdAB4nGWPTU7DMBCFX/oHpBKqqGCH5AViASj9EatuWFRq911036ZOmyqJI8et1ANwHo7ACTgC3IA78EgnmzaWx9+8eWNPANzgBx6O3y33kT1cMjtyDRe4F65TfxBukF+Em2jjVbhF/U3YxzOmwm10YXmD17hi9oR3YQ8dfAjXcI1P4Tr1L+EG+Vu4iTv8CrfQ8erCPuZeV7iNRy/2x1YvnF6p5UHFockikzm/gple75KFrdLqnGtbxCZTg6BfSVOdaVvdU+zXQ+ciFVmTqgmrOkmMyq3Z6tAFG+fyUa8XiR6EJuVYY/62xgKOcQWFJQ6MMUIYZIjK6Og7VWb0r7FDwl57Vj3N53RbFNT/c4UBAvTPXFO6stJ5Ok+BPV8bUnV0K27LnpQ0kV7NSRKyQl7WtlRC6gE2ZVeOEXpc0Yk/KGdI/wAJWm7IAAAAeJxtyEEOgCAMBMBd1GL4pZF6o5Aiif7eRK/OcRDwSfgXGThx5kJh5Apeca+lqJ1SPav3ZNXadr8zbHTN4noMy8ADbqkPvQAA') format('woff'),url(icon-userinfo.ttf?t=1506396008916) format('truetype'),url(icon-userinfo.svg?t=1506396008916#icon-userinfo) format('svg')}.icon-userinfo{font-family:icon-userinfo!important}.icon-comment:before{content:"\e626"}.icon-orders:before{content:"\e627"}.icon-nonpayment:before{content:"\e628"}.icon-unused:before{content:"\e629"}.icon-delete:before,.icon-refund:before{content:"\e62a"}@font-face{font-family:high-quality;src:url(../font/high-quality.eot);src:url(../font/high-quality.eot?#iefix) format('embedded-opentype'),url(../font/high-quality.woff) format('woff'),url(../font/high-quality.ttf) format('truetype'),url(../font/high-quality.svg#iconfont) format('svg')}@font-face{font-family:col-iconfont;src:url(col-iconfont.eot?t=1507800163458);src:url(col-iconfont.eot?t=1507800163458#iefix) format('embedded-opentype'),url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),url(col-iconfont.ttf?t=1507800163458) format('truetype'),url(col-iconfont.svg?t=1507800163458#iconfont) format('svg')}.col-iconfont{font-family:col-iconfont!important}.icon-card:before{content:"\e62b"}.icon-pastdue:before{content:"\e62c"}
    </style>
</head>
<body>
    <div class="north">
        <ul>
            <li class="title nav-item mf-shang-hei-regular">狠优惠</li>
        </ul>

    </div>
    <div class="center">
        <div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
            <div class="center-child"></div>
        </div>

    </div>
</body>
</html>